<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- JSTL标签库是一个JSP标签的集合，封装了许多jsp应用程序通用的核心功能-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!-- JSTL格式化标签 -->
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
		<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/layui-v2.6.13/layui/css/layui.css"/>
		<script src="${pageContext.request.contextPath}/js/jquery.min-2.1.1.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/layui-v2.6.13/layui/layui.js"></script>
		<style>
			.layui-row{
				margin-left: 20px;
				margin-top: 20px;
			}
		</style>
</head>
<body>
	<%-- <form class="layui-form" action="">
	</form> --%>
	<div class="layui-row">
		<button type="button" class="layui-btn" onclick="add()">添加</button>
		<table class="layui-table">
			<!-- colgroup中可以使用col来定义表格单元格宽度， -->
			<colgroup>
			  <col width="400">
			  <col width="900">
			  <col>
			</colgroup>
			<thead>
			  <tr>
				<th>学院ID</th>
				<th>学院名称</th>
				<th>操作</th>
			  </tr> 
			</thead>
			<tbody>
	 			<c:forEach items="${list}" var="str">
				    <tr>
						<td>${str.id}</td>
						<td>${str.cName}</td>
						<td><button type="button" class="layui-btn" onclick="update('${str.id}')">更新</button></td>
			  		</tr>
				</c:forEach>
			</tbody>
		</table>
		<div style="text-align: center;">
			  <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="queryByPageNO(1,${totalPage})">首页</button> 
			  <button class="layui-btn" onclick = "queryByPageNO(${pageNo-1},${totalPage})">上一页</button> 
			  <span class = "layui-font-16">${pageNo} / ${totalPage}页</span>
			  <button class="layui-btn" onclick = "queryByPageNO(${pageNo+1},${totalPage})">下一页</button> 
			  <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="queryByPageNO(${totalPage},${totalPage})">尾页</button>
		</div>
	</div>

</body>
<script>
	function queryByPageNO(pageNo,totalPage){
		if(pageNo <= totalPage){
			//查询条件
			var params = $("form").serialize();
			if(pageNo < 1) pageNo = 1;
			window.location.href = "c?m=selectAllCollege&pageNo="+pageNo;
		}
	}
	layui.use('layer', function(){
		  var layer = layui.layer;
		});
		function update(id){
			layer.open({
				type: 2,
				area: ['500px', '300px'],
				title: "更新信息页面",
				content: 'c?m=updateCollegePage&id='+id,
				yes: function(index, layero) {
					layer.close(index);
				},
			})
		}
		function add(){
			layer.open({
				type: 2,
				area: ['500px', '300px'],
				title: "添加信息页面",
				content: 'add_coll.jsp',
				yes: function(index, layero) {
					layer.close(index);
				},
		})
	}
</script>
</html>